<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
    <meta content="email=no" name="format-detection">
    <meta name="description" content="不超过150个字符" />
    <meta name="keywords" content="" />
    <meta content="caibaojian" name="author" />
    <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.2/css/swiper.min.css"> -->
    <link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/1.1.2/weui.min.css">    
    <link rel="stylesheet" href="../static/css/confirm.css">
    <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.2/js/swiper.min.js"></script> -->
    <!-- 设计稿 1rem = 100px -->
    <script src="../static/js/flexible.js"></script>
    <script src="../static/js/weui.js"></script>
    <!-- 滚动插件 -->
    <!-- <script src="https://unpkg.com/better-scroll/dist/bscroll.min.js"></script> -->
    <title>麦谷道</title>
</head>
<body>
<div class="confirm-container">
    <div class="header">
        <div class="top-bar flex-r-b">
            <div class="left goback"></div>
            <div>确认订单</div>
            <div class="right clear"></div>
        </div>
    </div>
    <!-- 联系人信息 -->
    <div class="userInfo flex-r-b">
        <span class="icon"></span>
        <div class="info flex-c-b">
            <p class="name ellipsis">收件人：<span>李小明</span><span>13500000123</span></p>
            <p class="address ellipsis">收货地址：<span>福州市台江区五一中路源利明珠大厦</span><span>福州市台江区五一中路源利明珠大厦</span></p>
        </div>
        <span class="add-address">添加地址</span>
    </div>
    <!-- 配送时间 -->
    <div class="time flex-r-b">
        <span class="text">配送时间</span>
        <div class="date">2018-12-10 星期一<span class="icon"></span></div>
        <div class="hour">14:00-15:00 <span class="icon"></span></div>
    </div>
    <!-- 订单列表 -->
    <div class="order-list">
        <div class="order-card">
            <div class="middle flex-r-b">
                <div class="img">
                    <img src="../static/images/index/img_9.png" alt="">
                </div>
                <div class="right flex-c-b">
                    <p class="name ellipsis">法式布蕾蛋糕 Pandora</p>
                    <p class="size">尺寸：6寸 （订单已满299免邮）</p>
                    <p class="flex-r-b">
                        <span class="price">￥198</span>
                        <span>x1</span>
                    </p>
                </div>
            </div>
        </div>
        <div class="order-card">
            <div class="middle flex-r-b">
                <div class="img">
                    <img src="../static/images/index/img_9.png" alt="">
                </div>
                <div class="right flex-c-b">
                    <p class="name ellipsis">法式布蕾蛋糕 Pandora</p>
                    <p class="size">尺寸：6寸 （订单已满299免邮）</p>
                    <p class="flex-r-b">
                        <span class="price">￥198</span>
                        <span>x1</span>
                    </p>
                </div>
            </div>
        </div>
        <div class='other'>
            <div class="flex-c-b">
                <h3>餐具/蜡烛/贺卡</h3>
                <p>
                    <span>免费餐具：5套、</span>
                    <span>免费蜡烛：2套、</span>
                    <span>生日帽：1个、</span>
                    <span>生日帽：1个、</span>
                </p>
            </div>           
        </div>
    </div>
    <!-- 优惠 -->
    <div class="coupon-list">
        <div class="item flex-r-b">
            <span clsas='text'>优惠券</span>
            <span class="btn">0张优惠券</span>
        </div>
        <div class="item flex-r-b">
            <span clsas='text'>积分抵用</span>
            <span class="btn">500积分</span>
        </div>
        <div class="item flex-r-b">
            <span clsas='text'>会员卡</span>
            <span class="btn">未支付</span>
        </div>
        <div class="item flex-r-b">
            <span class="text">订单留言：</span>
            <input type="text" class="words" />
        </div>
    </div>

    <div class="bottom-bar flex-r-b">
        <div class="left">
            <span>合计：</span>
            <span class="total">￥398.00</span>
        </div>
        <div class="pay-btn">确认支付</div>
    </div>
</div>
</body>
<script>
    (function () {
        window.onload = function () {
            goBack()
        }
        // 路由返回
        function goBack() {
            document.querySelector('.goback').onclick = function () {
                window.history.go(-1)
            }
        }
    })()
</script>
</html>